.landscape{
    width:100%; height:100%; background:#32373b;position: fixed; left:0;top: 0;z-index:99; display:none; text-align: center;
}

.landscape_box{
    position: relative; margin-left: auto; margin-right: auto; top: 50%; transform:translateY(-50%); -webkit-transform:translateY(-50%);
}

.landscape span{
    font-size:22px;display:block;color:#ffd40a; text-align:center;width: 100%;padding-top: 10px; line-height:2;
}

.landscape .inner{
    width: 128px;
    height: 194px;
    display: inline-block;
    background-image: url('../../common/img/icon/landscape.png');
    background-size: 100% 100%;
    -webkit-animation: landscapeAni 1.5s ease infinite alternate;animation: landscapeAni 1.5s ease infinite alternate;
}

@-webkit-keyframes landscapeAni{0% {-webkit-transform:rotate(-90deg);}30% {-webkit-transform:rotate(-90deg);}70%{-webkit-transform:rotate(0deg);}100% {-webkit-transform:rotate(0deg);}}
    
@keyframes landscapeAni{0% {transform:rotate(-90deg);}30% {transform:rotate(-90deg);}70%{transform:rotate(0deg);}100% {transform:rotate(0deg);}}

@media screen and (orientation:portrait) {
    .landscape{
        display: none;
    }
}
@media screen and (orientation:landscape) {
    .landscape{
        display: block;
    }
    .container{
        display: none;
    }
}